<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"/>
    <meta name="format-detection" content="telephone=no" />
    <title>绑定手机</title>
    <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/1.1.2/weui.min.css"/>
</head>
<body ontouchstart="">

<div class="container" id="container">
    <div class="weui-panel">
        <div class="weui-panel__hd">
            <p style="vertical-align:middle;">认证信息</p>
        </div>
        <div class="weui-panel__bd">
            <div class="weui-media-box weui-media-box_small-appmsg">
                <div class="weui-cells">
                    <div class="weui-cell">
                        <div class="weui-cell__bd">
                            <p>学工号</p>
                        </div>
                        <div class="weui-cell__ft" th:text="${xh}"></div>
                    </div>
                    <div class="weui-cell">
                        <div class="weui-cell__bd">
                            <p>姓名</p>
                        </div>
                        <div class="weui-cell__ft" th:text="${name}"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="weui-cells__title">请输入微信绑定的手机号</div>
    <div class="weui-cells weui-cells_form">
        <form th:action="@{/wework/users/register}" id="my_form" method="post">
            <div class="weui-cell">
                <div class="weui-cell__hd">
                    <label class="weui-label">手机号</label>
                </div>
                <div class="weui-cell__bd">
                    <input id="phone" name="phone" class="weui-input" th:value="${phone}"
                           type="tel" placeholder="请输入手机号"/>
                </div>
            </div>
        </form>
    </div>
    <div class="weui-msg__opr-area" style="margin: 0 auto;padding: 15px 0;width: 80%;">
        <p class="weui-btn-area">
            <a id="submit_btn" onclick="register_check()" class="weui-btn weui-btn_primary">确认提交</a>
        </p>
    </div>
</div>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="https://res.wx.qq.com/open/libs/weuijs/1.1.3/weui.min.js"></script>
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

<script th:inline="javascript">
    /*<![CDATA[*/
    function register_check() {
        var tel = $("#phone").val().trim();
        if(tel == ""){
            weui.alert('请输入正确的手机号码！');
        }else{
            weui.confirm('请务必使用个人微信，并确保您填写的手机号已在微信绑定，是否进行下一步？', {
                title: '提示',
                buttons: [{
                    label: '取消',
                    type: 'default',
                    onClick: function(){

                    }
                }, {
                    label: '确认',
                    type: 'primary',
                    onClick: function(){
                        $("#submit_btn").attr("disabled", "disabled");
                        $("#submit_btn").html("已提交");
                        $("#my_form").submit();
                    }
                }]
            });
        }
    }
    /*]]>*/
</script>
</html>